<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1> 司机 监听测试页面 - 模拟司机客户端</h1>
<button onclick="setMessageContent('鼠标电涡流')">测试展示</button>
<div id="message">展示服务推送过来的</br></div>

<button onclick="sourceClose()">关闭连接</button>

<script>

    userId = "1686560020082507778";
    identity = 2;
    if (window.EventSource){
        console.info("此浏览器支持SSE");
        // 前端与后端的连接建立
        soure = new EventSource("http://localhost:9000/connect/?userId=" + userId +"&identity=" + identity);

        // 监听服务的推送的消息
        soure.addEventListener("message",function (e) {
            content = e.data;
            console.info("消息内容" + content);

            setMessageContent(content);
        })

    }else{
        setMessageContent("此浏览器不支持");
    }

    function setMessageContent(content) {
        document.getElementById("message").innerHTML+= (content+'</br>');
    }

    function sourceClose() {
        console.info("close方法执行");
        // 客户端source的关闭
        soure.close();

        httpRequest = new XMLHttpRequest();
        httpRequest.open("get" , "http://localhost:9000/close/?userId=" + userId +"&identity=" + identity);
        httpRequest.send();

    }
</script>
</body>
</html>